<template>
  <div id="app">
    <h2>测试题</h2>
    <subject v-for="(item,index) in list" :key="index" :index='index' @tijiao='tijiaofn'></subject>


    <div>
      <flag v-for="(item,index) in list" :key="index" :item='item' :index='index'></flag>
    </div>
  </div>
</template>

<script>
  import subject from './components/Subject'
  import flag from './components/Flag'

  export default {
    components: {
      subject,
      flag

    },
    data() {
      return {
        // sum: 5,
        // sum1: 5
        // 第二个错误 直接用了一个变量循环了5次.导致后面传值 思路歪了
        list: ['未完成', '未完成', '未完成', '未完成', '未完成']


      }
    },
    methods: {
      tijiaofn(jieguo, index) {
        this.$set(this.list, index, jieguo)
      }
    }

    // created: {
    //   mounted() {
    //     this.$bus.$on('btn', () => {

    //     })
    //   }
    // }
  };
</script>

<style>
  body {
    background-color: #eee;
  }

  #app {
    background-color: #fff;
    width: 500px;
    margin: 50px auto;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.5);
    padding: 2em;
  }
</style>